<!--
 * @Author: bsj
 * @Date: 2024-04-07
 * @LastEditors: baoshijie
 * @LastEditTime: 2024-04-17
 * @Description: file content
 * @FilePath: \bridge_web\src\components\uploadFile\index.vue
-->
<template>
    <el-dialog  v-model="dialogVisible" title="基础配置" width="600px" @closed="handleClose" >
        <el-form :model="addParams" ref="addParamsRef" label-position="left" label-width="100px" v-loading="uploading">
            <el-form-item label="下载模版" >
                <span class="downloadTemplate" @click="downloadTemplate">下载模板</span>
            </el-form-item>
            <el-form-item label="文件" prop="file">
                <el-upload ref="uploadFile" class="upload-demo" :action="''" :before-upload="handleBeforeUpload"
                    :limit="1" :on-exceed="handleExceed" :http-request="httpRequest" :auto-upload="false">
                    <template #trigger>
                        <el-button type="primary" text style="background-color: #2F7DF1;">选择文件</el-button>
                    </template>
                    <template #tip>
                        <div class="el-upload__tip">
                            导入文件支持.xls、.xlsx格式
                        </div>
                    </template>
                </el-upload>
            </el-form-item>
        </el-form>
        <template #footer>
            <div class="dialog-footer">
                <el-button type="primary" @click="saveUpload" style="background-color: #2F7DF1;">确定</el-button>
                <el-button @click="dialogVisible = false">关闭</el-button>
            </div>
        </template>
    </el-dialog>
</template>
<script setup>
import { watch } from 'vue';
import { initStand } from '@/api/bridge'
import { ElMessage, ElMessageBox, genFileId } from "element-plus";
const { proxy } = getCurrentInstance();
const emit = defineEmits(['update:show'])
const store = useStore();
const compCode = computed(() => store.state.user.compCode);
const props = defineProps({
    show: {
        type: Boolean,
        default: false
    },
    row: {
        type: Object,
        default: {}
    }
})

const dialogVisible = ref(false)

// 上传
const uploadFile = ref(null);
const uploading = ref(false);

function handleBeforeUpload(file) {
    let arr = ['xls', 'xlsx'];
    let fileType = file.name.substr(file.name.lastIndexOf('.') + 1);
    let fileSize = file.size / (1024 * 1024);
    if (arr.indexOf(fileType) == -1) {
        ElMessage({
            message: '导入文件支持xls、xlsx格式',
            type: 'error',
        });
        return false;
    }

    return true;
}
const handleExceed = files => {
    uploadFile.value.clearFiles();
    const file = files[0];
    file.uid = genFileId();
    uploadFile.value.handleStart(file);
};
const httpRequest = (params) => {
    uploading.value = true;
    var formData = new FormData();
    formData.append('file', params.file);
    formData.append('type', 'FPAI/FPDI');
    initStand(formData)
        .then(res => {
            if (res.success) {
                ElMessage.success('导入成功!');
                handleClose();
            }
        })
        .catch(err => {
            ElMessage.error('导入失败了,请重新导入!');
        })
        .finally(res => {
            uploading.value = false;
        });
};
const saveUpload = () => {
    uploadFile.value.submit();
};
/**
 * @description: 下载模版
 * @return {*}
 */
function downloadTemplate() {
    proxy.downloadGetBlob($API.template);

}

const handleClose = () => {
    emit('update:show', false)
}
watch(props, (val) => {
    dialogVisible.value = props.show
}, {
    immediate: true
})
</script>